import React from 'react'
import { useNavigate } from 'react-router-dom'

// export default class Header extends Component {
//   render() {
//     return (
//       <>
//         <div className="page-header">
//           <h2>React Router Demo</h2>
          
//         <button onClick={this.goForward}>前进</button>
//         <button onClick={this.back}>后退</button>
//         </div>
//       </>
//     )
//   }
// }

function Header() {
  const navigate = useNavigate();
  const goForward = () => {
    navigate(1);
  }

  const back = () => {
    navigate(-1);
  }
  return (
    <>
      <div className="page-header">
        <h2>React Router Demo</h2>
        
      <button onClick={goForward}>前进</button>
      <button onClick={back}>后退</button>
      </div>
    </>
  )
}
export default Header;
